<template>
    <div>
      <h1>获取后端返回的 XML 数据</h1>
      <button @click="fetchXml1">获取 XML 数据</button>
      <pre>{{ xmlResponse }}</pre>
    </div>
  </template>
  
  <script >
  import axios from '@/api/index';
  import { XMLParser } from 'fast-xml-parser';
  export default {
    name: 'GetXml',
    data() {
      return {
        xmlResponse: '',  
      };
    },
    methods: {

      async fetchXml1() {
      try {
        const response = await axios.get('/getXml', {
          headers: { 'Accept': 'application/xml' },
        });

        // 使用 fast-xml-parser 解析 XML 数据
        const parser = new XMLParser();
        const result = parser.parse(response);
        const  xmldate  =   result.request;
        console.log(xmldate);
        this.xmlResponse = { statxus, message };
      } catch (error) {
        console.error('解析 XML 数据失败:', error);
      }
    },

      async fetchXml() {
        try {
          const response = await axios.get('/getXml', {
            headers: {
              'Accept': 'application/xml', // 明确告诉服务器我们接受 XML 数据
            },
          });
  
      const parser = new DOMParser();
      const xmlDoc = parser.parseFromString(response, 'application/xml');

      // 提取 XML 中的数据
      const status = xmlDoc.querySelector('action')?.textContent;
      const message = xmlDoc.querySelector('email')?.textContent;

      console.log('Status:', status);
      console.log('Message:', message);

      this.xmlResponse = { status, message };
        } catch (error) {
          console.error('获取 XML 数据失败:', error);
          alert('获取 XML 数据失败，请检查控制台错误信息。');
        }
      },
    },
  };
  </script>
  
  <style scoped>
  pre {
    background-color: #f5f5f5;
    padding: 10px;
    border-radius: 5px;
  }
  </style>